body {
  background-color: #f8f8f8;
  font-family: "helvetica neue", helvetica, sans-serif;
  font-size: 16px;
  overflow: hidden;
}

label, #readcontrol {
  display: block;
  padding: 20px;
  border-bottom: solid 1px #ddd;
  border-right: solid 1px #ddd;
  width: 300px;
}

label {
  color: #999;
}

.css3button {
-moz-box-shadow:inset 0px 1px 0px 0px #ffffff;
-webkit-box-shadow:inset 0px 1px 0px 0px #ffffff;
box-shadow:inset 0px 1px 0px 0px #ffffff;
background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ededed), color-stop(1, #dfdfdf) );
background:-moz-linear-gradient( center top, #ededed 5%, #dfdfdf 100% );
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#dfdfdf');
background-color:#ededed;
-moz-border-radius:6px;
-webkit-border-radius:6px;
border-radius:6px;
border:1px solid #dcdcdc;
display:inline-block;
color:#777777;
font-family:arial;
font-size:15px;
font-weight:bold;
padding:6px 24px;
text-decoration:none;
text-shadow:1px 1px 0px #ffffff;
}.css3button:hover {
background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #dfdfdf), color-stop(1, #ededed) );
background:-moz-linear-gradient( center top, #dfdfdf 5%, #ededed 100% );
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#dfdfdf', endColorstr='#ededed');
background-color:#dfdfdf;
}.css3button:active {
position:relative;
top:1px;
}

#port-picker,
#status, #write-info, #read-info {
  color: #000;
}

#port-picker {
  max-width: 250px;
  margin-right: 10px;
}

#position-input {
  display: block;
   -webkit-appearance:none !important;
  width: 90%;
  margin: 20px auto;
  height: 6px;
  background: rgb(13, 168, 97);
}

#position-input::-webkit-slider-thumb {
  -webkitappearance:none !important;
  width: 30px;
  height: 30px;
  border-radius: 15px;
  background: rgb(67, 135, 253);
}

#image {
  position: absolute;
  right: 20px;
  top: 0px;
  background-image: url(chrome-logo.svg);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  width: 64px;
  height: 64px;
  -webkit-transition: all .2s linear;
}

#container {
  position: absolute;
  top: 1px;
  left: 1px;
  bottom: 5px;
width: 640px;
}

#tv {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 320px;
  height: 240px;
  border-left: solid 1px #ddd;
}

#tv video,
#tv img {
  display: none;
}

#tv.working video,
#tv.broken img {
  display: block;
}

#messagewindow{   
  position:absolute;
           /*left:container.width;*/
  left:350px;
  right:0;
  border:1px solid #000;
  overflow:auto;
  top:0;
  bottom:1px;
}

